<template>
  <div class="app-container">
    <a-title @clickPreview="preview" />
    <el-form :model="queryParams" ref="queryForm" :inline="true" label-width="68px">
      <el-form-item label="专家姓名" prop="name">
        <el-input
          v-model="queryParams.name"
          placeholder="请输入专家姓名"
          clearable
          size="small"
          style="width: 240px"
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="专业类别" prop="professionCategory">
        <!-- <el-cascader
          :options="categoryOptions"
          filterable
          v-model="queryParams.professionCategory"
          :show-all-levels="false"
          :props="{ value: 'id',emitPath:false  }"
          style="width: 240px"
        ></el-cascader>-->
        <el-select
          v-model="queryParams.professionCategory"
          placeholder="请选择"
          filterable
          clearable
          size="small"
          style="width: 240px"
        >
          <el-option
            v-for="item in categoryOptions"
            :key="item.id"
            :label="item.label"
            :value="item.id"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="专业" prop="profession">
        <el-input
          v-model="queryParams.profession"
          placeholder="请输入专业"
          clearable
          size="small"
          style="width: 240px"
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="职称" prop="professionalTitle">
        <el-input
          v-model="queryParams.professionalTitle"
          placeholder="请输入角色名称"
          clearable
          size="small"
          style="width: 240px"
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="联系电话" prop="phonenumber">
        <el-input
          v-model="queryParams.phonenumber"
          placeholder="请输入联系电话"
          clearable
          size="small"
          style="width: 240px"
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="专家库" v-if="leaderFlag==='是'">
        <el-select
          v-model="queryParams.source"
          placeholder="请选择"
          clearable
          size="small"
          style="width: 240px"
        >
          <el-option label="个人专家库" value="0" />
          <el-option label="企业专家库" value="1" />
        </el-select>
      </el-form-item>
      <el-form-item label="专家库" v-else>
        <el-select
          v-model="queryParams.source"
          placeholder="请选择"
          clearable
          size="small"
          style="width: 240px"
        >
          <el-option label="个人专家库" value="0" />
        </el-select>
      </el-form-item>
      <el-form-item label="使用时间">
        <el-date-picker
          v-model="dateRange"
          type="daterange"
          range-separator="-"
          value-format="yyyy-MM-dd"
          start-placeholder="开始日期"
          end-placeholder="结束日期"
          style="width: 240px"
        ></el-date-picker>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">查询</el-button>
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
      </el-form-item>
    </el-form>
    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-dropdown trigger="click" @command="handleCommand">
          <el-button type="primary" size="mini">
            新增
            <i class="el-icon-arrow-down el-icon--right"></i>
          </el-button>
          <el-dropdown-menu slot="dropdown">
            <el-dropdown-item command="a">使用专家</el-dropdown-item>
            <el-dropdown-item command="b">自动抽取</el-dropdown-item>
          </el-dropdown-menu>
        </el-dropdown>
      </el-col>
      <el-col :span="1.5">
        <el-button type="primary" plain icon="el-icon-download" size="mini" @click="handleExport">导出</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="primary"
          plain
          icon="el-icon-delete"
          size="mini"
          :disabled="multiple"
          @click="handleDelete"
        >删除</el-button>
      </el-col>
    </el-row>
    <div class="tablebox">
      <el-table
        stripe
        :data="tableData"
        v-loading="loading"
        style="width: 100%"
        ref="multipleTable"
        @selection-change="handleSelectionChange"
        @sort-change="tableSortChange"
        :default-sort="{prop: 'createTime', order: 'descending'}"
      >
        <el-table-column type="selection" width="55"></el-table-column>
        <el-table-column
          label="专家姓名"
          prop="name"
          :sort-orders="['ascending', 'descending']"
          sortable="custom"
          width="110"
        ></el-table-column>
        <el-table-column label="职称" align="center" prop="professionalTitleText" width="80"></el-table-column>
        <el-table-column label="专业类别" prop="professionCategoryName" align="left"></el-table-column>
        <el-table-column
          label="专业"
          align="center"
          prop="profession"
          :sort-orders="['ascending', 'descending']"
          sortable="custom"
          width="120"
        ></el-table-column>
        <el-table-column label="联系方式" align="center" prop="phonenumber" width="120">
          <template slot-scope="scope">
            <div v-if="scope.row.source=='0'">{{scope.row.phonenumber}}</div>
            <div v-else></div>
          </template>
        </el-table-column>
       <!-- <el-table-column label="专家来源" align="center" prop="sourceText" width="120"></el-table-column>-->
        <el-table-column
          label="使用时间"
          align="center"
          prop="useDate"
          :sort-orders="['ascending', 'descending']"
          sortable="custom"
          width="120"
        >
          <template slot-scope="scope">
            <span>{{ parseTime(scope.row.useDate,'{y}-{m}-{d} ') }}</span>
          </template>
        </el-table-column>
        <el-table-column width="200" label="操作" align="center">
          <template slot-scope="scope">
            <a @click="handleView(scope.$index, scope.row)">
              <i class="el-icon-view aicon"></i>查看详情
            </a>
            <a @click="handleRegister(scope.$index, scope.row)">
              <i class="el-icon-edit-outline aicon"></i>使用登记
            </a>
          </template>
        </el-table-column>
      </el-table>
      <pagination
        v-show="total>0"
        :total="total"
        :page.sync="queryParams.pageNum"
        :limit.sync="queryParams.pageSize"
        @pagination="handleQuery"
      />
    </div>

    <!-- 自动抽取 -->
    <el-dialog title="提示" :visible.sync="autoSelect" width="60%">
      <div slot="title"></div>
      <div class="autobox">
        <el-button type="primary" @click="addCondition">添加抽取条件</el-button>
        <div>
          专家库
          <el-select v-if="leaderFlag==='是'" v-model="autoList.source" placeholder="请选择" style="margin-left:20px">
            <el-option label="个人专家库" value="0"></el-option>
            <el-option label="企业专家库" value="1"></el-option>
          </el-select>
          <el-select v-else v-model="autoList.source" placeholder="请选择" style="margin-left:20px">
            <el-option label="个人专家库" value="0"></el-option>
          </el-select>
        </div>
      </div>
      <el-table :data="autoList.autoExtractVo" border style="width: 100%">
        <el-table-column prop="name" label="抽取条件分类" width="180"></el-table-column>
        <el-table-column label="抽取条件值" prop="professionCategory">
          <template slot-scope="scope">
           <!-- <el-cascader
              :options="categoryOptions"
              filterable
              v-model="scope.row.professionCategory"
              :show-all-levels="false"
              :props="{ value: 'id' ,emitPath:false }"
              style="width:100%"
            ></el-cascader>
            -->
            <el-cascader
            :options="categoryOptions"
            filterable
            v-model="scope.row.professionCategory"
            :show-all-levels="false"
            :props="{ multiple: false,value: 'id',emitPath:false,checkStrictly: true }"
            :collapse-tags="false"
            style="width:100%"
          />


          </template>
        </el-table-column>
        <el-table-column label="专家人数" width="100" prop="counts">
          <template slot-scope="scope">
            <el-input v-model.number="scope.row.counts"></el-input>
          </template>
        </el-table-column>
        <el-table-column width="100" label="操作">
          <template slot-scope="scope">
            <a @click="autoDelete(scope.$index, scope.row)">
              <i class="el-icon-delete aicon"></i>删除
            </a>
          </template>
        </el-table-column>
      </el-table>
      <span slot="footer" class="dialog-footer">
        <el-button @click="autoSelect = false">取消</el-button>
        <el-button type="primary" @click="autoSumbit">抽取</el-button>
      </span>
    </el-dialog>
    <!-- 使用专家 -->
    <el-dialog title="添加专家使用" :visible.sync="useSelect" width="80%" @close="cancelUserExpert">
      <!-- <div slot="title"></div> -->
      <div class="tabletitle">
        <el-row :gutter="20">
          <el-col :span="8">
            <div class="input-wrap">
              <div class="input-label">专家库</div>
              <div class="input-content" v-if="leaderFlag==='是'">
                <el-select v-model="useSelectParams.source" placeholder="请选择" clearable>
                  <el-option label="个人专家库" value="0" />
                  <el-option label="企业专家库" value="1" />
                </el-select>
              </div>
              <div class="input-content" v-else>
                <el-select v-model="useSelectParams.source" placeholder="请选择">
                  <el-option label="个人专家库" value="0" />
                </el-select>
              </div>
            </div>
          </el-col>
          <el-col :span="8">
            <div class="input-wrap">
              <div class="input-label">专家姓名</div>
              <div class="input-content">
                <el-input v-model="useSelectParams.name" placeholder="请输入"></el-input>
              </div>
            </div>
          </el-col>
          <el-col :span="8">
            <div class="input-wrap">
              <div class="input-label">专业类别</div>
              <div class="input-content">
                <el-select
                  v-model="useSelectParams.professionCategory"
                  placeholder="请选择"
                  filterable
                  style="width: 100%"
                >
                  <el-option
                    v-for="item in categoryOptions"
                    :key="item.id"
                    :label="item.label"
                    :value="item.id"
                  />
                </el-select>
                <!-- <el-cascader
                  :options="categoryOptions"
                  filterable
                  v-model="useSelectParams.professionCategory"
                  :show-all-levels="false"
                  :props="{ value: 'id' ,emitPath:false }"
                  style="width:100%"
                  clearable
                ></el-cascader>-->
              </div>
            </div>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="8">
            <div class="input-wrap">
              <div class="input-label">专业</div>
              <div class="input-content">
                <el-input v-model="useSelectParams.profession" placeholder="请输入"></el-input>
              </div>
            </div>
          </el-col>
          <el-col :span="8">
            <div class="input-wrap">
              <div class="input-label">职称</div>
              <div class="input-content">
                <el-select v-model="useSelectParams.professionalTitle" clearable placeholder="请选择">
                  <el-option label="中级" value="0"></el-option>
                  <el-option label="高级" value="1"></el-option>
                  <el-option label="正高级" value="2"></el-option>
                  <el-option label="无" value="3"></el-option>
                  <el-option label="其他" value="4"></el-option>
                </el-select>
              </div>
            </div>
          </el-col>
          <el-col :span="8" style="padding:8px 18px;text-align:right">
            <el-button type="primary" @click="expertList">查询</el-button>
            <el-button @click="reset">重置</el-button>
          </el-col>
        </el-row>
        <!-- <el-row>
          <el-col :span="8" style="padding:8px">
            <el-button type="primary" @click="addList">新增</el-button>
          </el-col>
        </el-row>-->
      </div>
      <div class="tablebox">
        <el-table
          :data="expertListData"
          style="width: 100%"
          ref="multipleTable"
          @selection-change="listSelectChange"
        >
          <el-table-column type="selection" width="55"></el-table-column>
          <el-table-column label="专家姓名" align="center" prop="name" width="110"></el-table-column>
          <el-table-column label="专业类别" align="left" prop="professionCategoryName"></el-table-column>
          <el-table-column label="专业" align="center" prop="profession" width="150"></el-table-column>
          <el-table-column label="职称" align="center" prop="professionalTitleText" width="80"></el-table-column>
          <el-table-column label="联系方式" align="center" width="120" prop="phonenumber">
            <template slot-scope="scope">
              <div v-if="scope.row.source=='0'">{{scope.row.phonenumber}}</div>
              <div v-else></div>
            </template>
          </el-table-column>
          <!--<el-table-column label="专家来源" align="center" prop="source" width="110">
            <template slot-scope="scope">
              <div v-if="scope.row.source=='0'">个人专家库</div>
              <div v-else>企业专家库</div>
            </template>
          </el-table-column>-->
          <el-table-column label="状态" width="90" align="center">
            <template slot-scope="scope">
              <el-tag
                :type="scope.row.currentState === '0' ? 'success' : 'info'"
                disable-transitions
              >{{scope.row.currentStateText}}</el-tag>
            </template>
          </el-table-column>
          <el-table-column label="推荐率" prop="recommendRate" align="center" width="100"></el-table-column>
          <el-table-column width="120" label="操作" align="center">
            <template slot-scope="scope">
              <a @click="handleView(scope.$index, scope.row)">
                <i class="el-icon-view aicon"></i>查看详情
              </a>
            </template>
          </el-table-column>
        </el-table>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="cancelUserExpert">取 消</el-button>
        <el-button type="primary" @click="addList" :disabled="canClick">确 定</el-button>
      </span>
    </el-dialog>
    <!-- 使用登记 -->
    <el-dialog title="提示" :visible.sync="isRegister" width="60%">
      <div slot="title"></div>
      <div class="tabletitle">
        <el-row :gutter="20">
          <el-col :span="24">
            <div class="input-wrap">
              <div class="input-label">专家姓名</div>
              <div class="input-content">
                <el-input v-model="infoList.name" placeholder="请输入" :disabled="true"></el-input>
              </div>
            </div>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="12">
            <div class="input-wrap">
              <div class="input-label">使用时间</div>
              <div class="input-content">
                <el-date-picker v-model="infoList.useDate" type="date" placeholder="选择日期"></el-date-picker>
              </div>
            </div>
          </el-col>
          <el-col :span="12">
            <div class="input-wrap">
              <div class="input-label">专家使用费</div>
              <div class="input-content">
                <el-input v-model="infoList.useAmount" placeholder="请输入"></el-input>
              </div>
            </div>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <div class="input-wrap">
              <div class="input-label">咨询服务内容</div>
              <div class="input-content">
                <el-input
                  v-model="infoList.consultingContent"
                  placeholder="请输入"
                  type="textarea"
                  rows="4"
                ></el-input>
              </div>
            </div>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <div class="input-wrap">
              <div class="input-label">专家使用评价意见</div>
              <div class="input-content">
                <el-input v-model="infoList.opinion" placeholder="请输入" type="textarea" rows="4"></el-input>
              </div>
            </div>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <div class="input-wrap">
              <div class="input-label">附件上传</div>
              <div class="input-content">
                <vue-uploader
                  v-if="open"
                  :single-type="false"
                  :file-list="infoList.useAttachments"
                  @changeFileData="changeFile"
                  @removeFileList="removeFileList"
                  :pathName="'TJECdocuments/专家使用'"
                />
              </div>
            </div>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <div class="input-wrap">
              <div class="input-label">是否推荐</div>
              <div class="input-content">
                <el-select v-model="infoList.isRecommend">
                  <el-option label="推荐" value="1"></el-option>
                  <el-option label="不推荐" value="0"></el-option>
                </el-select>
              </div>
            </div>
          </el-col>
        </el-row>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="isRegister = false">取消</el-button>
        <el-button type="primary" @click="useSumbit">确定</el-button>
      </span>
    </el-dialog>
    <!-- 查看详情 -->
    <use-expert
      :dialogVisible="isExpertInfo"
      v-if="isExpertInfo"
      @changedialogVisible="changedialogVisible"
      :expertInfo="expertInfo"
      :isCompanyExpertAdmin="isCompanyExpertAdmin"
    ></use-expert>
    <!-- 预览 -->
    <el-dialog :visible.sync="openPreview" width="80%">
      <iframe :src="manualPreviewUrl" frameborder="0" width="100%" height="700px"></iframe>
    </el-dialog>
  </div>
</template>
<script>
import useExpert from "@/components/ExpertModal/use";
import aTitle from "@/components/Title";
import {
  expertUse,
  expertUseInfo,
  updateExpertUse,
  exportExpert,
  delExpert,
  autoExtract,
  expertList,
  addexpertList,
  isUseCompanyExpert
} from "@/api/business/expertUse";
import { personalExpertInfo } from '@/api/projectleader/expertGlance';
import { companyExpertInfo } from '@/api/companyLibrary/firmExpert';
import { professionCategory } from "@/api/expert/professionCategory";
import vueUploader from '@/components/Uploader';
export default {
  name: "expertUse",
  components: { useExpert, aTitle, vueUploader },
  data () {
    return {
      leaderFlag:undefined,
      manualPreviewUrl: null,
      openPreview: false,
      isCompanyExpertAdmin: false,
      total: 0,
      multiple: true,
      loading: true,
      expertInfo: null,
      // 是否显示弹出层
      open: false,
      titles: [],
      dateRange: [],
      categoryOptions: [],
      queryParams: {
        pageNum: 1,
        pageSize: 20,
        name: undefined,
        professionCategory: undefined,
        profession: undefined,
        professionalTitle: undefined,
        phonenumber: undefined,
        source: undefined,
        businessId: undefined
      },
      infoList: {
        name: null,
        useDate: null,
        useAmount: null,
        consultingContent: null,
        opinion: null,
        isRecommend: null,
        useAttachmentIds: [],
        useAttachments: []
      },
      autoSelect: false,
      useSelect: false,
      isRegister: false,
      isExpertInfo: false,
      multipleSelection: [],
      multipleSelectionList: [],
      expertListData: [],
      useSelectParams: {
        name: undefined,
        professionCategory: undefined,
        profession: undefined,
        professionalTitle: undefined,
        source: '0'
      },
      tableData: [],
      autoList: {
        autoExtractVo: [],
        source: "0"
      },
      canClick: false,
    };
  },
  created () {
    this.queryParams.businessId = this.$route.params.id;
    this.handleQuery();
    professionCategory().then(res => {
      if (res.code === 200) {
        this.categoryOptions = res.data;
      }
    });
    this.getLeaderFlag();
    //this.expertList();
  },
  mounted(){
    document.title=document.getElementById("businessNameTitle").innerHTML;
  },
  methods: {
    getLeaderFlag(){
      isUseCompanyExpert(this.$route.params.id).then(res=>{
        this.leaderFlag = res.msg;
      });
    },
    preview () {
      this.openPreview = true;
      this.manualPreviewUrl = `${this.previewUrl}${encodeURIComponent(
        `${this.operationManual}业务主页/专家使用.xlsx`
      )}&name=${encodeURIComponent("专家使用.xlsx")}`;
    },
    changeFile (id) {
      this.infoList.useAttachmentIds.push(id);
      
    },
    removeFileList (id) {
      this.infoList.useAttachmentIds = this.infoList.useAttachmentIds.filter(
        item => item != id
      )
      this.infoList.useAttachments = this.infoList.useAttachments.filter(
        item => item.fileId != id
      )
    },
    handleQuery () {
      this.loading = true;
      expertUse(this.addDateRange(this.queryParams, this.dateRange)).then(
        res => {
          if (res.code === 200) {
            this.total = res.total;
            this.tableData = res.rows.map(item => {
              if (item.source === "0") {
                item.sourceText = "个人专家库";
              } else if (item.source === "1") {
                item.sourceText = "企业专家库";
              } else {
                item.sourceText = "手动新增";
              }

              switch (item.professionalTitle) {
                case "0":
                  item.professionalTitleText = "中级";
                  break;
                case "1":
                  item.professionalTitleText = "高级";
                  break;
                case "2":
                  item.professionalTitleText = "正高级";
                  break;
                case "3":
                  item.professionalTitleText = "无";
                  break;
                case "4":
                  item.professionalTitleText = "其他";
                  break;
              }

              return item;
            });
            this.loading = false;
          }
        }
      );
    },
    resetQuery () {
      this.queryParams.pageNum = undefined;
      this.queryParams.name = undefined;
      this.queryParams.professionCategory = undefined;
      this.queryParams.profession = undefined;
      this.queryParams.professionalTitle = undefined;
      this.queryParams.phonenumber = undefined;
      this.queryParams.source = undefined;

      this.dateRange = [];
      this.handleQuery();
    },
    expertList () {
      this.useSelectParams.businessId = this.$route.params.id;
      expertList(this.useSelectParams).then(res => {
        if (res.code === 200) {
          this.expertListData = res.rows.map(item => {
            item.currentStateText = item.currentState === '0' ? "在用" : "停用";
            switch (item.professionalTitle) {
              case "0":
                item.professionalTitleText = "中级";
                break;
              case "1":
                item.professionalTitleText = "高级";
                break;
              case "2":
                item.professionalTitleText = "正高级";
                break;
              case "3":
                item.professionalTitleText = "无";
                break;
              case "4":
                item.professionalTitleText = "其他";
                break;
            }
            return item;
          });
        }
      });
    },
    cancelUserExpert () {
      this.useSelect = false;
      this.reset();
      //this.expertListData=[];
    },
    reset () {
      (this.useSelectParams = {
        name: undefined,
        professionCategory: undefined,
        profession: undefined,
        professionalTitle: undefined,
        source: this.useSelectParams.source,
        businessId: this.$route.params.id
      })
      this.expertListData = [];
    },
    handleDelete () {
      let delId = this.multipleSelection.map(item => item.guid);
      let titles = this.multipleSelection.map(item => item.name);
      this.$confirm("是否确定删除专家姓名为 “"+ titles +"” 的专家？", "提示", {
        confirmButtonText: "确认",
        cancelButtonText: "取消",
        type: "warning"
      }).then(() => {
        delExpert(delId).then(res => {
          if (res.code === 200) {
            this.handleQuery();
            this.msgSuccess(res.msg);
          }
        });
      });
    },
    handleCommand (command) {
      if (command === "a") {
        this.useSelect = true;
        this.canClick = false;
      } else {
        this.autoSelect = true;
        this.autoList = {
          autoExtractVo: [],
          source: "0"
        };
      }
    },
    //抽取 begin
    addCondition () {
      this.autoList.autoExtractVo.push({
        name: "专家专业类别",
        professionCategory: "",
        counts: ""
      });
    },
    autoDelete (index) {
      this.autoList.autoExtractVo.splice(index, 1);
    },
    autoSumbit () {
      if(!this.autoList.autoExtractVo || this.autoList.autoExtractVo.length<=0){
        this.msgError("抽取条件分类必填！");
        return false; 
      }
      var returnFlag = false;
      this.autoList.autoExtractVo = this.autoList.autoExtractVo.map(item => {
        
        if(!item.counts || !item.professionCategory){
          returnFlag = true;
        }
        return item;
      });
      
      if(returnFlag){
        this.msgError("请填写完整的抽取条件值和专家人数！");
        return false;
      }
      
      this.autoList.businessId = this.$route.params.id;
      autoExtract(this.autoList).then(res => {
        if (res.code === 200) {
          this.msgSuccess(res.msg);
          this.autoSelect = false;
          this.handleQuery();
        } else {
          this.msgError(res.msg);
        }
      });
    },
    //end
    addList () {
      if(this.multipleSelectionList && this.multipleSelectionList.length<=0){
        this.msgError("请选择专家！");
        return false;
      }
      //this.multipleSelectionList.businessId = this.$route.params.id
      this.canClick = true;
      addexpertList(this.multipleSelectionList).then(res => {
        if (res.code === 200) {
          this.msgSuccess("新增成功");
          this.useSelect = false;
          this.handleQuery();
        } else {
          this.msgError(res.msg);
        }
        this.canClick = false;
      });
    },
    handleRegister (index, row) {
      expertUseInfo(row.guid).then(res => {
        if (res.code === 200) {
          this.infoList = res.data;
          if(this.infoList.useAttachmentIds == null){
            this.infoList.useAttachmentIds = []
          }
          console.log(this.infoList,'infoList')
          this.isRegister = true;
          this.open = true;
        }
      });
    },
    useSumbit () {
      updateExpertUse(this.infoList).then(res => {
        if (res.code === 200) {
          this.open = false
          this.msgSuccess(res.msg);
          this.isRegister = false;
          this.handleQuery();
        }
      });
    },
    handleView (index, row) {
      this.expertInfo = row
      this.isExpertInfo = true;
      // if (row.source === '1') {
      //   companyExpertInfo(row.guid).then(res => {
      //     this.expertInfo = res.data;
      //     this.isExpertInfo = true;
      //   })
      // } else {
      //   personalExpertInfo(row.guid).then(res => {
      //     this.expertInfo = res.data;
      //     this.isExpertInfo = true;
      //   })
      // }
    },
    handleSelectionChange (val) {
      this.multipleSelection = val;
      this.multiple = !val.length;
    },
    listSelectChange (val) {
      if (val) {
        var businessId = this.$route.params.id;
        val.forEach(item => {
          item.businessId = businessId;
          item.expertId = item.guid;
        });
      }
      this.multipleSelectionList = val;
    },
    changedialogVisible (val) {
      this.isExpertInfo = val;
    },
    handleExport () {
      exportExpert(this.queryParams).then(res => {
        if (res.code === 200) {
          this.download(res.msg);
        }
      });
    },
    tableSortChange (column) {
      this.queryParams.pageNum = 1;

      if (column.order === "descending") {
        this.queryParams.sortBy = column.prop;
        this.queryParams.order = "desc";
      } else {
        this.queryParams.sortBy = column.prop;
        this.queryParams.order = "asc";
      }
      this.handleQuery();
    }
  }
};
</script>
<style lang="scss" scoped>
.tabletitle {
  margin: 0 20px;
  .input-wrap {
    padding: 8px;
    display: flex;

    .input-label {
      min-width: 1em;
      max-width: 6em;
      color: rgba(0, 0, 0, 0.65);
      margin-right: 8px;
      display: flex;
      margin-top: 10px;
      flex: 0 0 90px;
    }

    .input-content {
      -webkit-box-flex: 1;
      flex-grow: 1;
      .el-select {
        width: 100%;
      }
    }
  }
}
.tablebox {
  margin-top: 20px;
}
/deep/.el-table .cell {
  font-family: PingFangSC-Regular;
  color: rgba(0, 0, 0, 0.85);
  letter-spacing: 0;
  // text-align: center;
  a {
    font-family: PingFangSC-Regular;
    font-size: 14px;
    color: #1890ff;
    letter-spacing: 0;
    text-align: right;
    line-height: 14px;
    margin: 0 5px;
  }
}

/deep/.el-cascader--medium {
  .el-input--medium .el-input__inner {
    height: 32px;
    line-height: 32px;
  }
}

/deep/.el-range-editor--medium.el-input__inner {
  height: 32px;
  line-height: 32px;
}

.autobox {
  display: flex;
  justify-content: space-between;
  margin-bottom: 20px;
}

/deep/.el-input.is-disabled {
  .el-input__prefix {
    display: none;
  }
  .el-input__suffix {
    display: none;
  }
}

/deep/.el-input.is-disabled .el-input__inner {
  background-color: #fff;
  border-color: #fff;
  color: #606266;
  cursor: auto;
  padding-left: 15px;
}
/deep/.el-input.is-disabled .el-input__inner:hover {
  background-color: #fff;
  border-color: #fff;
  color: #606266;
  cursor: auto;
}
/deep/.el-input.is-disabled .el-input__inner::-webkit-input-placeholder {
  color: #fff;
}
/deep/.el-input.is-disabled .el-input__inner::-moz-placeholder {
  color: #fff;
}
/deep/.el-input.is-disabled .el-input__inner::-ms-input-placeholder {
  color: #fff;
}

/deep/ .el-textarea.is-disabled .el-textarea__inner {
  background-color: #fff;
  border-color: #fff;
  color: #606266;
  resize: none;
  cursor: auto;
}
/deep/.el-textarea.is-disabled .el-textarea__inner::-webkit-input-placeholder {
  color: #fff;
}
/deep/.el-textarea.is-disabled .el-textarea__inner::-moz-placeholder {
  color: #fff;
}
/deep/.el-textarea.is-disabled .el-textarea__inner::-ms-input-placeholder {
  color: #fff;
}
</style>